<template>
    <div class="ChCompetition">
        <header class="mui-bar mui-bar-nav">
            <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
            <h1 class="mui-title" style="color:#fff;">支付成功</h1>
        </header>
        <div class="Chheader">
            <div class="Chhome">
                <div class="Chhomeone"><img src="../../img/Game/支付成功图片.png" alt=""></div>
                <div class="Chhometwo">支付成功</div>
                <div class="Chhomethere">订单正在连接投注得路上......</div>
            </div>
        </div>
        <div class="zhuyao">
            <div class="zhuyao1">订单编号：
                <span class="zhuyao11">000201803235659</span>
            </div>
            <div class="zhuyao2">下单时间：
                <span class="zhuyao11">2018-03-23</span>
            </div>
            <div class="zhuyao3">投注金币额：
                <span class="zhuyao31">200</span>
            </div>
        </div>
        <div class="btn">
            <mt-button size="normal" type="danger" @click="purchase()">接着游戏</mt-button>
        </div>
        <div class="btn">
            <mt-button size="normal" type="primary" @click="purchase()">查看详情</mt-button>
        </div>
    </div>
</template>
<script>
export default {
    data() {
        return {};
    },
    created() {},
    methods: {},
    components: {}
};
</script>
<style lang="scss" scoped>
.ChCompetition {
    .btn {
        margin: 0 auto;
        width: 80%;
        margin-bottom: 0.22rem;
    }
    span {
        display: inline-block;
    }
    .m_right5 {
        margin-right: 0.5rem;
    }
    padding-top: 40px;
    padding-bottom: 0.6rem;
    .mui-bar {
        background: #d51313;
        a {
            color: #fff;
        }
        .mint-button::after {
            background: #d51313;
        }
        box-shadow: none;
    }
    .mint-navbar {
        .mint-tab-item.is-selected {
            box-sizing: border-box;
            border-bottom: 0.04rem solid red;
        }
        .mint-tab-item {
            padding: 0.23rem 0;
            .c1 {
                font-size: 0.3rem;
            }
        }
    }
    .Chheader {
        background: url("../../img/Game/椭圆2.png") no-repeat;
        height: 3.4rem;
        background-size: 7.5rem 1.5rem;
        margin-bottom: 0.22rem;
        .Chhome {
            height: 100%;
            width: 90%;
            margin: 0 auto;
            background: #fff;
            padding: 0 0.24rem;
            padding-top: 0.22rem;
            border-radius: 0.05rem;
            box-shadow: 0.02rem 0.02rem 0 0.03rem rgba(244, 203, 203, 0.5);
            text-align: center;

            div {
                margin-bottom: 0.2rem;
            }
            .Chhomeone {
                width: 2.21rem;
                height: 1.75rem;
                margin: 0 auto;
                margin-bottom: 0.2rem;
                img {
                    width: 2.21rem;
                    height: 1.75rem;
                }
            }
            .Chhometwo {
                height: 0.38rem;
                font-size: 0.38rem;
                color: #33d518;
            }
            .Chhomethere {
                font-size: 0.26rem;
                color: #4f4f4f;
            }
        }
    }
    // ///////////

    .zhuyao {
        margin: 1.22rem 0;
        height: 2rem;
        text-align: center;
        font-size: 0.28rem;
        .zhuyao1 {
        }
        .zhuyao11 {
            color: #4f4f4f;
        }
        .zhuyao31 {
            color: #d51313;
        }
        div {
            margin-bottom: 0.24rem;
        }
    }
}
</style>   